<template>

  <login></login>

</template>
<script>
  import Login from './login/Login.vue'
  export default {
    components : {
      Login
    }
  }
</script>
<style>
  .auth{
    height:100%;
    background: url('../../assets/images/1.jpg') no-repeat center center;
    background-size: cover;
    animation-name:changepic;
    animation-duration:12s;
    /*变换时间*/
    animation-delay:2s;
    /*动画开始时间*/
    animation-iteration-count:infinite;
    /*下一周期循环播放*/
    animation-play-state:running;
    /*动画开始运行*/
  }
  @keyframes changepic
  {
    10%   {background:url("../../assets/images/1.jpg") no-repeat center center;background-size: cover;}
    29%  {background:url("../../assets/images/2.jpg") no-repeat center center;background-size: cover;}
    63%  {background: url("../../assets/images/3.jpg") no-repeat center center;background-size: cover;}
    90% {background:url("../../assets/images/4.jpg") no-repeat center center;background-size: cover;}
  }
  .auth .form{background: rgba(255,255,255,0.2);width:400px;margin:120px auto;}
  /*阴影*/
  .auth .fa{display: inline-block;top: 27px;left: 6px;position: relative;color: #ccc;}
  .auth input[type="text"],input[type="password"]{padding-left:26px;}
  .auth .checkbox{padding-left:21px;}
</style>
